import Vue from "vue";
const state = {
  list: localStorage.getItem('list') ? JSON.parse(localStorage.getItem('list')) : [],
  finishlist: localStorage.getItem('finishlist') ? JSON.parse(localStorage.getItem('finishlist')) : [],
  collections: localStorage.getItem('collections') ? JSON.parse(localStorage.getItem('collections')) : []
};

const mutations = {
  addItem(state, { value }) {
    if (value !== "") state.list.push(value);
    state.collections.push(-1);
    console.log("add");
  },
  removeItem(state, { editIndex }) {
    state.collections.splice(editIndex,1);
    const filterList = state.list.filter((item, index) => {
      return index !== editIndex;
    });
    state.finishlist.push(state.list[editIndex]);
    state.list = filterList;
    console.log("remove");
  },
  editItem(state, { index, editVal }) {
    //1.数组, 2.索引 3. 改变索引内容
    Vue.set(state.list, index, editVal);
    console.log("edit");
  },
  delAll(state, { delAll }) {
    console.log(delAll);
    //第一种思路
    // for (let l = 0; l < delAll.length; l++) {
    //     state.list[delAll[l]] = undefined;
    // }
    // state.list = state.list.filter(Boolean);
    // 第二种思路
    //deleteArr 1 0
    //items '3'
    delAll.sort((a, b) => b - a);
    for (let i = 0; i < delAll.length; i++) {
      state.list.splice(delAll[i], 1);
      state.collections.splice(delAll[i],1);
    }
    
    //第三种思路
    // let deleteElement = [];
    // //根据索引取值
    // for (let i = 0; i < delAll.length; i++) {
    // 	const originList = [...state.list];
    // 	for (let j = 0; j < state.list.length; j++) {
    // 		deleteElement.push(originList.splice(delAll[i])[0]); //删除返回的是数组 因为只删除了一个 所以取第0个元素
    // 	}
    // }
    // deleteElement = deleteElement.filter(Boolean); //过滤空值  包括false undefined null 0....
    // console.log(deleteElement);
    // //根据值删除原先list的值
    // for (let l = 0; l < deleteElement.length; l++) {
    // 	for (let k = 0; k < state.list.length; k++) {
    // 		if (state.list[k] == deleteElement[l]) {
    // 			state.list.splice(k, 1);
    // 			k--;
    // 		}
    // 	}
    // }
  },
  changeState(state, { changeArray }) {
    for (let i = 0; i < changeArray.length; i++) {
      const index = changeArray[i];
      console.log(index);
      state.finishlist.push(state.list[index]);
      state.list[changeArray[i]] = undefined;
    }
    state.list = state.list.filter(Boolean);
  },
  addCollections(state, { index }) {
    //state.collections[index] = 1; //代表已收藏
    const finalVal = state.collections[index] === -1 ? 1 : -1;
    Vue.set(state.collections, index, finalVal);
    // console.log(state.collections);
  }
};
const actions = {
  addItem: ({ commit }, payload) => {
    commit("addItem", payload);
  },
  editItem: ({ commit }, payload) => {
    commit("editItem", payload);
  },
  removeItem: ({ commit }, payload) => {
    commit("removeItem", payload);
  },
  delAll: ({ commit }, payload) => {
    commit("delAll", payload);
  },
  changeState: ({ commit }, payload) => {
    commit("changeState", payload);
  },
  addCollections: ({ commit }, payload) => {
    commit("addCollections", payload);
  }
};

export default {
  namespaced: true,
  state,
  mutations,
  actions
};
